<!-- 首页 手机号登录 -->
<template>
    <view class="agreement-box">
        <view class="agreement-text"  @click="checkFn">
            <img :src="state.isCheck ? icon01 : icon02" /><text class="text-box">我已阅读并同意</text><text
                v-for="item in prop.agreementList" :key="item.id" @click.stop="jumpFn(item)">{{ item.name }}</text>
        </view>
    </view>
</template>

<script setup>
import icon01 from "@/assets/image/icon01.png"
import icon02 from "@/assets/image/icon02.png"
import { reactive } from "vue"

const prop = defineProps(['agreementList'])

const emits= defineEmits(["update:isAgree"])

const state = reactive({
    isCheck: false,    
})

const checkFn = () => {
    state.isCheck = !state.isCheck
    emits("update:isAgree",state.isCheck)
}


const jumpFn = (item) => {
    let {url} = item
    uni.navigateTo({
        url: '/pages/webViewPage/index'
    });
}

</script>

<style lang="scss" scoped>
.agreement-box {
    width: 100vw;
    display: flex;
    justify-content: center;

    .agreement-text {
        display: flex;
        align-items: center;
        font-size: 24rpx;
        height: 48rpx;
        line-height: 48rpx;

        img {
            width: 32rpx;
            height: 32rpx;
            margin-right: 10rpx;
        }

        .text-box {
            color: #999999;
        }
    }
}
</style>
